<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>清分</title>
    <link href="../../../css/common.css" rel="stylesheet"/>
    <link href="../../../css/mui.min.css" rel="stylesheet"/>
    <script src="../../../js/vue.min.js"></script>
    <script src="../../../js/mui.min.js"></script>
    <script src="../../../js/fastclick.js"></script>
    <script src="../../../js/api.js"></script>
    <script src="../../../js/common.js"></script>
    <script src="../../../js/vue-common.js"></script>
    <style>
        html, body, #app {
            height: 100%;
            overflow: hidden;
        }

        .qf-position-icon {
            width: 1rem;
            vertical-align: middle;
        }

        .qf-add-card {
            padding: 10px;
            background-color: #fff;
        }

        .qf-add-card.line {
            border-top: 1px solid #F3F3F3;
        }

        .qf-add-label {
            margin-bottom: 10px;
        }

        .qf-add-label .title {
            font-size: 1.3rem;
            color: #999;
        }

        .qf-add-label .text {
            margin-top: .5rem;
            font-size: 1.5rem;
            font-weight: bold;
            color: #666;
        }

        .qf-add-card input.qf-input {
            display: block;
            border: none;
            background-color: #F3F3F3;
            height: 4rem;
            width: 80%;
            margin: 2rem auto;
        }

        .qf-add-btn {
            position: absolute;
            width: 100%;
            bottom: 1rem;
            left: 0;
        }
        .name-title {
            font-size: 1.3rem;
            color: #999;
        }
    </style>
</head>
<body>
<div id="app">
    <div class="header-nav">
        <span>新增</span>
        <div class="icon"><img src="../../../img/common/btn_back.png" alt=""></div>
    </div>

    <div class="container  top">
        <div class="qf-add-card">
            <div class="qf-add-label">
                <div class="title">机具信息</div>
                <div class="text">{{device.insSide}}的{{device.typeName}}({{device.modelCode}})</div>
            </div>
            <div class="qf-add-label">
                <div class="title"><img @click="goMap(device.xCode,device.yCode)" class="qf-position-icon" src="../../../img/common/ic_location.png" alt="">
                    {{device.address}}
                </div>
            </div>

        </div>
        <div class="qf-add-card line">
            <div class="name-title">账务金额</div>
            <input class="qf-input" v-model="billMoney" type="text" placeholder="请输入账务金额">
        </div>

        <div class="qf-add-btn">
            <div @click="doSubmit" class="xl-btn normal next no-shadow">提交</div>
        </div>
    </div>
</div>
<script>
    var vm = new Vue({
        el: '#app',
        mounted: function () {
            var data = getItem('qingfenInfo');
            this.device = data.device;
            this.clearBillInfoMap = data.clearBillInfoMap;

        },
        data: {
            clearBillInfoMap: {},
            device: {},
            billMoney:null

        },
        computed:{
            showUserName:function () {
                var data  = this.clearBillInfoMap;
                if(data){ // {{clearBillInfoMap.billUsr1Name}}
                    var name1 = this.clearBillInfoMap.billUsr1Name;
                    var name2 = this.clearBillInfoMap.billUsr2Name;
                    if(name1 && name2){
                        return  name1 + ','+ name2;
                    }
                    if(name1){
                        return name1;
                    }
                    if(name2){
                        return name2;
                    }
                }
                return null;

            }
        },
        methods: {
            goMap: function (xCode, yCode) {
                goMapPage(xCode, yCode, 0);
            },
            doSubmit: function () {
                if(!this.billMoney){
                    return mui.toast('请输入金额!');
                }
                if(!checkInputMoneyIsOk(this.billMoney)){
                    return mui.toast('输入金额格式有误，请重新输入！');
                }
                Resource.post(QING_FEN_Add_ORDER_BILL, { billMoney: this.billMoney, deviceId: this.device.id}, function (res) {
                   mui.toast('操作成功!');
                    // 关闭页面
                   setTimeout(function () {
                       closeWebViewById('pages/order/qingfen/addQinfenOrder.html');
                       closeWebViewById('pages/order/qingfen/addNav.html');
                   },200);
                    // 跳转详情
                    redirect('pages/order/qingfen/index.html');

                })
                var listView = plus.webview.getWebviewById('pages/order/qingfen/index.html');
                mui.fire(listView, 'changeTab', {
                    'params': {}
                });

            }
        }
    });

    mui.plusReady(function () {
        var self = plus.webview.currentWebview();
        var type = self.type;
        if (type == '' || type == 'undefined') {
            return;
        }
    })

</script>
</body>
</html>
